import QtQuick 1.1
import com.nokia.meego 1.0

Item {
    id: root
    implicitWidth: parent ? parent.width : screen.width
    implicitHeight: 60

    property string text
    property string role: "center"  //"center" "foot" "top"
    property string mode: mouseArea.pressed ? "active" : "enable"  //"enable" "active"
    property bool showIndicator: false
    property alias paddingItem: paddingItem
    signal clicked
    signal pressAndHold
    BorderImage {
        anchors.fill: parent
        source: "images/input_%1_%2.png".arg(role).arg(mode)
        border { left: 10; right: 10; top: 10; bottom: 10 }
    }
    Label {
        anchors.fill: paddingItem
        text: root.text
        verticalAlignment: Text.AlignVCenter

        color: appWindow.colorDark
        elide: Text.ElideRight
    }
    Item {
        id: paddingItem;
        anchors {
            left: parent.left
            top: parent.top
            bottom: parent.bottom
            right: root.showIndicator ? indicatorLoader.left : parent.right
            margins: 15
        }
    }
    Loader {
        id: indicatorLoader
        anchors {
            right: parent.right; rightMargin:10;
            verticalCenter: parent.verticalCenter
        }
        sourceComponent: root.showIndicator ? indComp : undefined
    }
    Component {
        id: indComp
        Image {
            source: "images/icon_more.png"
            height:15
            fillMode: Image.PreserveAspectFit
        }
    }
    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onClicked: root.clicked()
        onPressAndHold: root.pressAndHold()
    }
}
